import React, { Component } from 'react'
import {connect} from 'react-redux';


// import store from '../store';
import {
  increAction,
  decreAction,
  increAsyncAction,
} from '../store/action/count';
 class count extends Component {
  input = React.createRef();
  incre = (val) => {
    // store.dispatch(increAction(val));
    this.props.incre(val)
  };
  decre = () => {
    // store.dispatch(decreAction());
    this.props.decre()
  };
  increAsync =(val,time)=>{
    // store.dispatch(increAsyncAction(val,time));
    this.props.increAsync(val,time)
  }
  render() {
    return (
      <div>
        <h2>这是Count组件:下方的组件列表长度为：{this.props.user.length}</h2>
        {this.props.count.num}
        <button onClick={()=>{this.incre("1")}}>+1</button>
        <button onClick={this.decre}>-1</button>
        <input type="text" ref={this.input} />
        <button onClick={()=>{this.incre(this.input.current.value)}}>点击加数值</button>
        <button onClick={()=>{this.increAsync("1","500")}}>异步加</button>
      </div>
    );
  }
}
//connect接收两个参数mapStateToProps,mapDispatchToProps对象
export default connect(
  (state) => ({
    count:state.count,
    user:state.user
  }),
  // dispatch =>({
  //   incre:(val)=>dispatch(increAction(val)),
  //   decre:()=>dispatch(decreAction()),
  //   increAsync:(val,time)=>dispatch(increAsyncAction(val,time))
  // })
  //mapDispatchToProps对象的简写
  {
    incre: increAction,
    decre: decreAction,
    increAsync: increAsyncAction,
  }
)(count);
